/* color palette from <https://github.com/vuejs/theme> */
$vt-c-white: #ffffff; // 纯白色
$vt-c-white-soft: #f8f8f8;
$vt-c-white-mute: #f2f2f2;

$vt-c-black: #181818; // 纯黑色
$vt-c-black-soft: #222222;
$vt-c-black-mute: #282828;

$vt-c-gray-500: #6b7280; // 灰色

$vt-c-primary: #3b82f6; /* 定义主色 */
$vt-c-blue-3b82f6: #3b82f6; // 主色
$vt-c-blue-6366f1: #6366f1; // 蓝色

$vt-c-purple-a855f7: #a855f7; // 紫色

$vt-c-green-22c55e: #22c55e; // 绿色

$vt-c-orange-f97316: #f97316; // 橙色

$vt-c-blue-f9fafb: #f9fafb; // 浅色背景
$vt-c-blue-f3f4f6: #f3f4f6; // 浅色背景
$vt-c-blue-ecf2ff: #ebf2fe; // 浅色背景
$vt-c-blue-box-shadow: rgba(59, 130, 246, 0.2); // 阴影颜色
$vt-c-black-box-shadow: rgba(0, 0, 0, 0.2); // 阴影颜色
$vt-c-placeholder-color: #9ca3af;

$vt-c-indigo: #2c3e50;

$vt-c-divider-light-1: rgba(56, 34, 34, 0.29);
$vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
$vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
$vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);

$vt-c-text-light-1: $vt-c-indigo;
$vt-c-text-light-2: rgba(60, 60, 60, 0.66);
$vt-c-text-dark-1: $vt-c-white;
$vt-c-text-dark-2: rgba(235, 235, 235, 0.64);

$vt-c-font-size-16: 16px; // 字体大小

$vt-c-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); // 阴影颜色
$vt-c-ring-offset-shadow: 0 0 #0000;
$vt-c-ring-shadow: 0 0 #0000; // 阴影颜色


$color-background: $vt-c-white;
$color-background-soft: $vt-c-white-soft;
$color-background-mute: $vt-c-white-mute;
$color-border: $vt-c-divider-light-2;
$color-border-hover: $vt-c-divider-light-1;
$color-heading: $vt-c-text-light-1;
$color-text: $vt-c-text-light-1;
$section-gap: 160px;
$font-size: $vt-c-font-size-16; // 默认字体大小

@media (prefers-color-scheme: light) {
  $color-background: $vt-c-black;
  $color-background-soft: $vt-c-black-soft;
  $color-background-mute: $vt-c-black-mute;

  $color-border: $vt-c-divider-dark-2;
  $color-border-hover: $vt-c-divider-dark-1;

  $color-heading: $vt-c-text-dark-1;
  $color-text: $vt-c-text-dark-2;
}
